<!DOCTYPE html>
<html>
    <head>
        <title>jiangcheng is learning Vue</title>
        <script src="https://unpkg.com/vue@next"></script>
        <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
        <script src="https://unpkg.com/vue-router@4"></script>
    </head>
    <body>
        <div id="app">{{info}}</div>
        <h1>网站列表</h1>
        <div v-for="site in sites">
            {{ site.name }}
        </div>
        <script>
            const app = {
                data(){
                    return {
                        info:"a ajax test"
                    }
                },
                mounted(){
                    axios.get('https://www.runoob.com/try/ajax/json_demo.json')
                    .then(response=>(this.info = response))
                    .catch(function(error){
                        //请求失败处理
                        console.log(error);
                    });
                }
            }


            // 直接在 URL 上添加参数 ID=12345
            axios.get('/user?ID=12345')
            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });
            
            // 也可以通过 params 设置参数：
            axios.get('/user', {
                params: {
                ID: 12345
                }
            })
            .then(function (response) {
                console.log(response);
            })
            .catch(function (error) {
                console.log(error);
            });

            Vue.createApp(app).mount('#app')
        </script>
    </body>
</html>